/*
 * @Author: Otway
 * @Date: 2019-01-09 11:16:08
 * @LastEditors: Otway
 * @LastEditTime: 2019-08-30 18:50:09
 * @copyright: h-visions
 */
import React, { PureComponent } from 'react';
// import { BasicPagination, isInvalidObject, compareNum, TableCustomize, openSuccessModal, openModalMessage, compareString } from '../../../components/TableCustomize'
// import * as CheckManagementService from '../../../axios/CheckManagement'
import {
    Row,
    Col,
    Form,
    Select,
    Layout,
    // List,
    // Button,
    // Pagination,
    Radio,
    Checkbox,
    Input,
    Alert,
    InputNumber,
    // Spin
} from 'antd';
const FormItem = Form.Item;
// const { Header, Footer, Sider, Content } = Layout;
const { Option } = Select

class AddFrom extends PureComponent {
    checkParameterFn = (rule, value, callback) => {
        const { formData } = this.props;

        console.log(value, formData.checkStandardMin)
        if (value && Number(value) >= Number(formData.checkStandardMin) && Number(value) <= Number(formData.checkStandardMax)) {
            callback();
        } else {
            callback('参数需在检验项目标准之间');
        }
    };


    render() {
        const { form: { getFieldDecorator, getFieldValue }, formData } = this.props;
        console.log(formData, 'formData')
        const formItemLayout = {
            // 抽屉里面Form。二列的布局比例
            labelCol: {
                span: 8
            },
            wrapperCol: {
                span: 12
            }
        };

        let arr = []
        if (formData.checkStandardOption1) arr.push({ key: 'checkStandardOption1', label: formData.checkStandardOption1 })
        if (formData.checkStandardOption2) arr.push({ key: 'checkStandardOption2', label: formData.checkStandardOption2 })
        if (formData.checkStandardOption3) arr.push({ key: 'checkStandardOption3', label: formData.checkStandardOption3 })
        if (formData.checkStandardOption4) arr.push({ key: 'checkStandardOption4', label: formData.checkStandardOption4 })
        if (formData.checkStandardOption5) arr.push({ key: 'checkStandardOption5', label: formData.checkStandardOption5 })

        let remark = formData.remark ? '(' + formData.remark + ')' : ''

        return (
            <Form >
                <Row>
                    <Alert message="更换模板后，当前记录的质检信息将被清空，请谨慎操作！" type="info" showIcon />
                </Row>
                <Row>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'ID'} hidden>
                            {getFieldDecorator('checkDetailsId', {
                                initialValue: formData.checkDetailsId || undefined,
                                getValueFromEvent: (event) => {
                                    return event.target.value.replace(/\s+/g, "")
                                },
                            })(<Input />)}
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'检验项目编码'}>
                            <div>{formData.checkItemCode}</div>
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'检验项目名称'}>
                            <div>{formData.checkItemName}</div>
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'第二类别所属分类'}>
                            <div>{formData.checkTypeSecond}</div>
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'检验项目标准'}>
                            {
                                formData.checkItemProperty == '1' ?
                                    <div>{formData.checkStandardMin ? (formData.checkStandardMin + ' ~ ' + formData.checkStandardMax) : '' + remark}</div>
                                    :
                                    formData.checkItemProperty == '2' ?
                                        <div>{formData.checkStandardText ? formData.checkStandardText : '' + remark}</div>
                                        :
                                        formData.checkItemProperty == '3' ?
                                            <div>
                                                <Radio.Group disabled>
                                                    <Row>
                                                        {
                                                            arr.map(item => {
                                                                return <Radio value={item.key}>{item.label}</Radio>
                                                            })
                                                        }
                                                    </Row>
                                                </Radio.Group>
                                                {remark}
                                            </div>
                                            :
                                            formData.checkItemProperty == '4' ?
                                                <div>
                                                    <Checkbox.Group disabled>
                                                        <Row>
                                                            {
                                                                arr.map(item => {
                                                                    return <Checkbox value={item.key}>{item.label}</Checkbox>
                                                                })
                                                            }
                                                        </Row>
                                                    </Checkbox.Group>
                                                    {remark}
                                                </div>
                                                : null
                            }
                        </FormItem>
                    </Col>
                    <Col span={24}>
                        <FormItem {...formItemLayout} label={'检验项目参数'}>
                            {getFieldDecorator('checkParameter', {
                                initialValue: formData.checkParameter ? (formData.checkItemProperty == 4 && formData.checkParameter.indexOf(',') != -1 ? formData.checkParameter.split(',') : formData.checkParameter) : undefined,
                                rules: [
                                    {
                                        required: true,
                                        message: '请填写检验项目参数'
                                    }
                                ]
                            })(
                                formData.checkItemProperty == '1' ?
                                    <InputNumber placeholder='请输入' allowClear ref={node => (this.input = node)} style={{ width: '100%' }} />
                                    :
                                    formData.checkItemProperty == '2' ?
                                        <Input placeholder='请输入' allowClear ref={node => (this.input = node)} style={{ width: '100%' }} />
                                        :
                                        formData.checkItemProperty == '3' ?
                                            <Select placeholder='请选择' allowClear ref={node => (this.input = node)} style={{ width: '100%' }}>
                                                {
                                                    arr.map(item => {
                                                        return <Option key={item.label}>{item.label}</Option>
                                                    })
                                                }
                                            </Select>
                                            :
                                            formData.checkItemProperty == '4' ?
                                                <Select mode="multiple" allowClear placeholder='请选择' ref={node => (this.input = node)} style={{ width: '100%' }}>
                                                    {
                                                        arr.map(item => {
                                                            return <Option key={item.label}>{item.label}</Option>
                                                        })
                                                    }
                                                </Select>
                                                : null
                            )}
                        </FormItem>
                        <FormItem {...formItemLayout} label={'检验结果'}>
                            {getFieldDecorator('checkResult', {
                                initialValue: formData.checkResult && (formData.checkResult == '1' || formData.checkResult == '2') ? formData.checkResult : null,
                                rules: [
                                    {
                                        required: true,
                                        message: '请选择检验结果'
                                    }
                                ]
                            })(<Radio.Group onChange={this.onChange} >
                                <Radio value={"1"}><span style={{ color: '#95f204fe' }}>合格</span></Radio>
                                <Radio value={"2"}><span style={{ color: '#d9001bfa' }}>异常</span></Radio>
                            </Radio.Group>)}
                        </FormItem>
                    </Col>
                </Row>
            </Form>
        );
    }
}

export default Form.create()(AddFrom);
